<template>
    <slot v-if="$slots.header"  name="header"></slot>
    <table>
            <thead>
                <tr>
                    <th>姓名</th>
                    <th>年龄</th>
                </tr>
            </thead>
            <tbody>
                    <template v-for="(item, index) in data" :key="index">
                        <tr :data-index="index">
                            <slot ></slot>
                        </tr>
                    </template>
            </tbody>
    </table>
    <slot v-if="$slots.footer" name="footer"></slot>
</template>
<script>
export default {
    name: "MyTable",
    provide() {
        return {
            rows: this.data
        }
    },
    props: {
        data: {
            type: Array,
            default: () => []
        }
    }
};
</script>
